<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-09-23 15:16:35
 * @LastEditTime: 2019-10-12 16:36:25
 * @LastEditors: Please set LastEditors
 -->
<template>
  <div class="container">
    <div class="container_card">
      <div class="container_head">
        <svg-icon icon-class="list" />  签名列表
      </div>
      <div class="container_body">
        <div class="btn_add"><el-button type="primary" @click="add_games">
          添加签名</el-button>
        </div>
        <template>
          <el-table
            :data="tableData"
            border
            style="width: 100%"
          >
            <el-table-column
              prop="name"
              label="签名名称"
            />
            <el-table-column
              prop="alias"
              label="别名"
            />
            <el-table-column
              fixed="right"
              label="操作"
              width="180"
            >
              <template slot-scope="scope">
                <el-button type="text" size="small" @click="delete_sign(scope.row.id)">删除</el-button>
                <!-- <el-button type="text" size="small" @click="save_game(scope.row.id)">编辑</el-button> -->
              </template>
            </el-table-column>
          </el-table>
        </template>
      </div>
    </div>
  </div>
</template>
<script>
import config from '../../config/config'
export default {
  data() {
    return {
      tableData: [],
      url: config.BASE_IMG
    }
  },
  mounted() {
    this.$api.get_sign_list([]).then(res => {
      console.log(res)
      this.tableData = res.data
    }).catch(() => {
      this.$notify.error({
        title: '错误',
        message: '网络错误！'
      })
    })
  },
  methods: {
    add_games() {
      this.$router.push('/games/sign-add')
    },
    save_game(id) {
      this.$router.push({
        path: '/games/sign-add',
        query: {
          id: id
        }
      })
    },
    delete_sign(id) {
      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$api.detach_sign({ id: id }).then(res => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          })
          for (let i = 0; i < this.tableData.length; i++) {
            if (this.tableData[i].id === id) {
              this.tableData.splice(this.tableData.indexOf(this.tableData[i], 1))
              break
            }
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    }
  }
}
</script>
<style scoped>
  .btn_add{
    margin-bottom: 40px;
  }
</style>
